<template>
    <h2>详情物资领用</h2>
    <table>
        <thead></thead>
        <tbody v-for="ine in tableData">
            <tr>
                <td>标题：{{ ine.headline }}</td>
            </tr>
            <tr>
                <td>用途描述：{{ ine.purposeDescription }}</td>
            </tr>
            <tr>
                <td>领用人：{{ ine.createName }}</td>
            </tr>
            <tr>
                <td>领用日期：{{ ine.createDate.substring(0, 10) }}</td>
            </tr>
            <tr>
                <td>备注：{{ ine.sPReserveNote }}</td>
            </tr>
            <tr>
                <td>审批状态：
                    <span v-if="ine.sPApprovalStatus == 1">待提交</span>
                    <span v-if="ine.sPApprovalStatus == 10">待审批</span>
                    <span v-if="ine.sPApprovalStatus == 20">已通过</span>
                    <span v-if="ine.sPApprovalStatus == 30">已拒绝</span>
                </td>
                <td>申请人：
                    <span v-if="ine.sPApprover == 'string' || ine.sPApprover == null">-</span>
                    <span v-else>{{ ine.sPApprover }}</span>
                </td>
            </tr>
            <table>
                <thead style="width: 100%" border="1">
                    <tr>
                        <th>货物名称</th>
                        <th>类型</th>
                        <th>材质</th>
                        <th>规格</th>
                        <th>产地</th>
                        <th>仓库数量</th>
                        <th>领用数量</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="inde in ine.selectItemsToReceiveDTOList">
                        <td>{{ inde.sMCargoName }}</td>
                        <td> {{ inde.typeName }}</td>
                        <td> {{ inde.materiaLqualityName }}</td>
                        <td> {{ inde.sMGaugeLattice }}</td>
                        <td> {{ inde.nationName }}-{{ inde.provinceName }}</td>
                        <td> {{ inde.sMQuantity }}</td>
                        <td>{{ inde.sIPQuantity }}</td>
                    </tr>
                </tbody>
            </table>
        </tbody>
    </table>
</template>

<script setup lang='ts'>
import { reactive, ref, onMounted, watch } from 'vue'
import axios from 'axios';
import { useRouter, useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()
//生命函数钩
onMounted(() => {
    //物资领用详情
    XQReceiving();
})
//显示列表
const tableData = ref([])
//物资领用显示
const XQReceiving = () => {
    axios.get("MaterialRead/api/Receiving/XQReceiving?receivingID=" + route.query.id).then(res => {
        tableData.value = res.data.data;
        console.log(res.data.data)
    }).catch(err => {
        console.log(err)
    })
}

</script>

<style></style>